<template>
	<view class="wrap">
		<view class="content">
			<view class="message">
				<u-grid
				    :border="false"
				    col="2"
				>
					<u-grid-item @click="routerTo('/pages/pageB/manage/pending')">
						<image src="@/static/img/censece/icon_1.png" mode=""></image>
						<text class="grid-text">待处理</text>
					</u-grid-item>
					<u-grid-item @click="routerTo('/pages/pageB/manage/process')">
						<image src="@/static/img/censece/icon_2.png" mode=""></image>
						<text class="grid-text">已处理</text>
					</u-grid-item>
					<!-- <u-grid-item>
						<image src="@/static/img/censece/icon_3.png" mode=""></image>
						<text class="grid-text">已发起</text>
					</u-grid-item>
					<u-grid-item>
						<image src="@/static/img/censece/icon_4.png" mode=""></image>
						<text class="grid-text">我收到的</text>
					</u-grid-item> -->
				</u-grid>
			</view>
			<view class="manage">
				<view class="title">假勤管理</view>
				<view class="manage_list">
					<u-grid
					    :border="false"
					    col="4"
					>
						<u-grid-item @click="routerTo('/pages/pageB/manage/replacement')">
							<image src="@/static/img/censece/icon_01.png" mode=""></image>
							<text class="grid-text">补卡</text>
						</u-grid-item>
						<u-grid-item @click="routerTo('/pages/pageB/manage/leave')">
							<image src="@/static/img/censece/icon_01.png" mode=""></image>
							<text class="grid-text">请假</text>
						</u-grid-item>
						<u-grid-item @click="routerTo('/pages/pageB/manage/betravel')">
							<image src="@/static/img/censece/icon_02.png" mode=""></image>
							<text class="grid-text">出差</text>
						</u-grid-item>
						<u-grid-item @click="routerTo('/pages/pageB/manage/goout')">
							<image src="@/static/img/censece/icon_03.png" mode=""></image>
							<text class="grid-text">外出</text>
						</u-grid-item>
						<u-grid-item @click="routerTo('/pages/pageB/manage/overtime')">
							<image src="@/static/img/censece/icon_04.png" mode=""></image>
							<text class="grid-text">加班</text>
						</u-grid-item>
						<u-grid-item @click="routerTo('/pages/pageB/manage/relief')">
							<image src="@/static/img/censece/icon_05.png" mode=""></image>
							<text class="grid-text">换班</text>
						</u-grid-item>
					</u-grid>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data () {
			return {
				
			}
		},
		methods: {
			routerTo(url) {
				uni.navigateTo({
					url: url
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.wrap {
		min-height: 100vh;
		height: fit-content;
		background-color: #F2F2F2;
		padding: 15px;
		box-sizing: border-box;
		
		.content {
			
			.message {
				background-color: #fff;
				border-radius: 10px;
				padding: 12px 0;
				box-sizing: border-box;
				margin-bottom: 15px;
				
				image {
					width: 24px;
					height: 24px;
					margin-bottom: 10px;
				}
				
				text {
					font-size: 14px;
				}
			}
			
			.manage {
				background-color: #fff;
				border-radius: 10px;
				padding: 12px;
				box-sizing: border-box;
				
				.title {
					font-size: 16px;
					font-weight: 700;
					margin-bottom: 15px;
				}
				
				.manage_list {
					
					image {
						width: 50px;
						height: 51px;
						margin-bottom: 15px;
					}
					
					text {
						display: block;
						margin-bottom: 15px;
						font-size: 14px;
					}
				}
			}
		}
	}
</style>